import React from 'react'
import { Avatar } from 'antd'
import http from '../../service/http.js'
import './index.css'
export default function UserList(props) {
  return (
    <div className={props.index===props.i?'click':''} onClick={()=>{
      props.changeIndex(props.i)
      props.changeHeaderMessage()
      props.setTo()
      http.getNews({newsId:props.newsId}).then((res)=>{
        props.changeNewsList(res.data.news)
      })
    }}>
      <div style={{display:'flex',backgroundColor:'#ffffff',borderBottom:'1px #c1c1c1 solid'}}>
        <div style={{flex:"2",display:'flex',justifyContent:'center',alignItems:'center'}}><Avatar src={props.user.img}/></div>
        <div style={{flex:"4"}}>
          <h3 style={{fontSize:'1px',cursor:'default'}}>{props.user.name}</h3>
          <span style={{fontSize:'1px',color:"#c1c1c1",cursor:'default'}}>{props.user.message.length>6?props.user.message.substring(0,5)+"...":props.user.message}</span>
        </div>
        <span style={{flex:"3",cursor:'default',fontSize:'1px',margin:0,padding:0,color:"#000000",display:'flex',justifyContent:'center',alignItems:'center'}}
          className={props.lineUsers.indexOf(props.user.username)===-1?'':'lineUser'}
        >
          {   
              props.lineUsers.indexOf(props.user.username)===-1?'离线':'在线'
          }
        </span>
      </div>
    </div>
  )
}
